import { useDispatch, useSelector } from 'react-redux';
import type { TypedUseSelectorHook } from 'react-redux';
import type { RootState, AppDispatch } from '../store';

/**
 * 类型化的 dispatch hook
 * 提供类型安全的 dispatch 函数
 */
export const useAppDispatch = () => useDispatch<AppDispatch>();

// 直接使用useDispatch的话
// 🎪 实际效果对比
// 智能提示和自动补全
// 使用 useDispatch：
// ❌ 没有 action 的智能提示
// ❌ 不知道 action 需要什么参数
// ❌ 无法检测拼写错误
// 使用 useAppDispatch：
// ✅ 完整的 action 列表自动补全
// ✅ 参数类型提示和验证
// ✅ 拼写错误立即检测

/**
 * 类型化的 selector hook
 * 提供类型安全的状态选择器
 */
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;
